<%--
  Created by IntelliJ IDEA.
  User: Jerry
  Date: 2019/10/4
  Time: 15:47
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>添加信息</title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
        function check(){
            var title = $("#title").val();
            var content = $("#content").val();
            var type = $("#type").val();
            if (title == null || title == "") {
                alert('标题不允许为空！');
                return false;
            } else if(content == null || content == ""){
                alert('内容不允许为空！');
                return false;
            } else if(type == "---请选择类别---"){
                alert('请选择类别！');
                return false;
            }
            return true;
        };
        $(function () {
            $("#title").blur(function () {
                var title = this.value;
                $.post("CheckInfoServlet","title="+title,callBack);
                function callBack(data) {
                    if (data > 0) {
                        $("#nameDiv").html('标题已被使用！');
                    } else {
                        $("#nameDiv").html('标题可以使用！');
                    }
                }
            })
        })
    </script>
</head>
<body>
<div align="center">
    <h2>我的工作笔记</h2>
    <form action="AddInfoServlet" method="post" onsubmit="return check();">
        <p>标题：<input type="text" name="title" id="title" style="display: inline">&nbsp;<font color="#c00fff">*</font>
            <span id="nameDiv"></span>
        </p>
        <p>内容：<textarea rows="5" cols="23" name="content" id="content" style="vertical-align: middle;"></textarea></p>

        <p style="vertical-align: middle;">
            类别：<select id="type" name="type">
            <option value="---请选择类别---">---请选择类别---</option>
            <option value="1">技术</option>
            <option value="2">行政</option>
            <option value="3">人事</option>
        </select>
        </p>
        <p><input type="submit" value="提交"></p>
    </form>
</div>
</body>
</html>